<template>
  <div class=""></div>
</template>

<script lang="ts">
  import { defineComponent, ref, toRefs, PropType } from 'vue';
  import { screenMap, sizeEnum } from '/@/enums/breakpointEnum';
  import { createBreakpointLisenOnce } from '/@/hooks/event/useBreakpoint';
  import designSetting from '/@/settings/designSetting';
  import { createAppProviderContext } from './useAppContext';
  export default defineComponent({
    name: 'AppProvider',
    props: {
      prefixCls: {
        type: String as PropType<string>,
        default: designSetting.prefixCls,
      },
    },
    setup(props) {
      const isMobileRef = ref(false);
      createBreakpointLisenOnce(({ width }) => {
        const lgWidth = screenMap.get(sizeEnum.LG);
        if (lgWidth) {
          isMobileRef.value = width.value - 1 < lgWidth;
        }
      });

      props;

      const { prefixCls } = toRefs(props);

      createAppProviderContext({ prefixCls, isMobile: isMobileRef });
      return {};
    },
  });
</script>
<style lang="less" scoped></style>
